<template>
  <section>
    <!--工具条-->
    <toolbar :buttonList="buttonList" @callFunction="callFunction"></toolbar>
    =
    <el-table
      :data="patchList"
      v-loading="listLoading"
      @select="dialogCheck"
      @row-click="selectCurrentRow"
      ref="table"
      class="custom-tbl"
      style="width: 100%"
    >
      <el-table-column type="selection" width="50"></el-table-column>
      <el-table-column prop="ID" type="index" width="80">{{
        ID
      }}</el-table-column>
      <el-table-column
        prop="P_Name"
        label="补丁名称"
        width=""
        sortable
      ></el-table-column>
      <el-table-column
        prop="P_Version"
        label="版本号"
        width=""
        sortable
      ></el-table-column>
      <el-table-column
        prop="P_Type"
        label="版本类别"
        width=""
        sortable
      ></el-table-column>
      <el-table-column
        prop="P_Info"
        label="补丁说明"
        width=""
        sortable
      ></el-table-column>
      <el-table-column
        prop="P_Submitter"
        label="创建人"
        width=""
        sortable
      ></el-table-column>
      <el-table-column
        prop="P_Createtime"
        label="上传时间"
        width=""
        sortable
      ></el-table-column>
    </el-table>
    <!--编辑界面-->
    <el-dialog
      title="编辑"
      :visible.sync="editFormVisible"
      v-model="editFormVisible"
      :close-on-click-modal="false"
    >
      <el-form :model="editForm" label-width="80px" ref="editForm">
        <el-form-item label="补丁名称" prop="P_Name">
          <el-input v-model="editForm.P_Name" auto-complete="on"></el-input>
        </el-form-item>
        <el-form-item label="版本号" prop="P_Version">
          <el-input v-model="editForm.P_Version" auto-complete="off"></el-input>
        </el-form-item>
        <el-form-item label="版本类别" prop="P_Type">
          <el-select v-model="editForm.P_Type" placeholder="请选择版本类型">
            <el-option
              :key="0"
              :label="'未选择版本类型'"
              :value="0"
            ></el-option>
            <el-option
              v-for="item in types"
              :key="item.name"
              :label="item.name"
              :value="item.name"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="补丁信息" prop="P_Info">
          <el-input
            v-model="editForm.P_Info"
            auto-complete="off"
            type="textarea"
          ></el-input>
        </el-form-item>
        <el-form-item label="补丁备注" prop="P_Remark">
          <el-input
            v-model="editForm.P_Remark"
            auto-complete="off"
            type="textarea"
          ></el-input>
        </el-form-item>
        <el-form-item style="border-right: 780px">
          <el-button type="primary" @click.native="editSubmit">保存</el-button>
          <el-button @click.native="editFormVisible = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--上传-->
    <el-dialog
      :visible.sync="loadFormVisible"
      v-model="loadFormVisible"
      :close-on-click-modal="false"
    >
      <!-- <el-form-tem>
            <el-upload
                class="upload-demo"
                action="string"
                :auto-upload="false"
                :on-preview="handlePreview"
                :on-remove="handleRemove"
                :before-remove="beforeRemove"
                :http-request="upLoad"		
                :limit="1"
                :on-exceed="handleExceed"
                :file-list="fileList">
                <el-button size="small" type="primary">选择文件</el-button>
                <div slot="tip" class="el-upload__tip">只能上传exe文件</div>
              </el-upload>
          </el-form-tem>
          <el-form-item style="border-right: 780px;">
            <el-button type="primary" @click.native="upLoad">上传到服务器</el-button>
          </el-form-item> -->

      <el-form
        :model="upform"
        :rules="uprules"
        style="width: 100%"
        ref="upform"
        label-width="100px"
      >
        <el-form-item label="版本号" prop="P_Version">
          <el-input
            v-model="upLoadForm.P_Version"
            auto-complete="off"
            disable="true"
          ></el-input>
        </el-form-item>
        <el-form-item label="版本类别" prop="P_Type">
          <el-input
            v-model="upLoadForm.P_Type"
            auto-complete="off"
            disable="true"
          ></el-input>
        </el-form-item>
        <el-form-item label="上传附件:">
          <el-upload
            class="avatar-uploader"
            action="/PatchUpload/Upload/Patchfile"
            :show-file-list="false"
            :headers="token"
            :data="ruleForm"
            :on-success="handleAvatarSuccess"
            :before-upload="beforeAvatarUpload"
          >
            <img v-if="editForm.tdLogo" :src="editForm.tdLogo" class="avatar" />
            <i v-else class="el-icon-plus avatar-uploader-icon plus-sign"></i>
          </el-upload>
          <!-- <el-button
            type="primary"
            @click="upLoadFile()"
            size="mini"
            class="form-btn"
            >点击上传</el-button
          > -->
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--新建界面-->
    <el-dialog
      title="新建补丁信息"
      :visible.sync="addFormVisible"
      v-model="addFormVisible"
      :close-on-click-modal="false"
    >
      <el-form ref="addForm" label-width="80px">
        <el-form-item label="补丁名称" prop="P_Name">
          <el-input v-model="addForm.P_Name" auto-complete="on"></el-input>
        </el-form-item>
        <el-form-item label="版本号" prop="P_Version">
          <el-input v-model="addForm.P_Version" auto-complete="off"></el-input>
        </el-form-item>
        <el-form-item label="版本类别" prop="P_Type">
          <el-select v-model="addForm.P_Type" placeholder="请选择版本类型">
            <el-option
              :key="0"
              :label="'未选择版本类型'"
              :value="0"
            ></el-option>
            <el-option
              v-for="item in types"
              :key="item.name"
              :label="item.name"
              :value="item.name"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="补丁信息" prop="P_Info">
          <el-input
            v-model="addForm.P_Info"
            auto-complete="off"
            type="textarea"
          ></el-input>
        </el-form-item>
        <el-form-item label="补丁备注" prop="P_Remark">
          <el-input
            v-model="addForm.P_Remark"
            auto-complete="off"
            type="textarea"
          ></el-input>
        </el-form-item>
        <el-form-item style="border-right: 780px">
          <el-button type="primary" @click.native="addSubmit"
            >立即创建</el-button
          >
          <el-button @click.native="addFormVisible = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </section>
</template>

<script>
import util from "../../../util/date";
import {
  testapi,
  addPatch,
  getPatchs,
  editFormPatch,
  uploadPatch,
  GetLatestPatchInfo,
  DownPatchFile,
  DelPatch,
} from "../../api/api";
import { getButtonList } from "../../promissionRouter";
import Toolbar from "../../components/Toolbar";

export default {
  components: { Toolbar },
  data() {
    return {
      showupLoadDialog: false,
      ruleForm: {
        P_Version: "9.20.0",
        P_Type: "GEPS",
        enable: "",
      },
      beforeAvatarUpload(file) {
        // const isJPG = file.type === "image/jpeg";
        // const isLt1M = file.size / 1024 / 1024 < 1;
        // // if (!isJPG) {
        // //   this.$message.error('上传头像图片只能是 JPG 格式!')
        // // }
        // if (!isLt1M) {
        //   this.$message.error("上传头像图片大小不能超过 1MB!");
        // }
        // return isLt1M;
      },
      handleAvatarSuccess(res) {
        alert(res.msg);
      },
      filters: {
        name: "",
      },
      fileList: [],
      types: [
        { Id: "GEPS", name: "GEPS" },
        { Id: "GEPS9", name: "GEPS9" },
        { Id: "T", name: "T" },
      ],
      options: [],
      buttonList: [],
      total: 0,
      currentRow: null,
      page: 1,
      listLoading: false,
      sels: [], //列表选中列
      patchList: [],
      addFormVisible: false,
      editFormVisible: false,
      loadFormVisible: false,
      editLoading: false,
      //新增界面数据
      addForm: {
        ID: "",
        P_Name: "",
        P_Type: "",
        P_Version: "",
        P_Info: "",
        P_Remark: "",
      },
      upLoadForm: {
        P_Version: "",
        files: [],
      },
      editForm: {
        ID: "",
        P_Name: "",
        P_Type: "",
        P_Version: "",
        P_Info: "",
        P_Remark: "",
      },
    };
  },
  methods: {
    handleAvatarSuccess(res) {
      this.loadFormVisible = false;
      alert(res.msg);
    },
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    handlePreview(file) {
      console.log(file);
    },
    handleExceed(files, fileList) {
      this.$message.warning(
        `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
          files.length + fileList.length
        } 个文件`
      );
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}?`);
    },
    dialogCheck(selection, row) {
      this.currentRow = null;
      this.$refs.table.clearSelection();
      if (selection.length === 0) {
        return;
      }
      if (row) {
        this.selectCurrentRow(row);
      }
    },
    selectCurrentRow(val) {
      if (val) {
        this.currentRow = val;
        this.$refs.table.clearSelection();
        this.$refs.table.toggleRowSelection(val, true);
      }
    },
    upLoad() {
      let row = this.currentRow;
      this.options = [];
      if (!row) {
        this.$message({
          message: "请选择要关联的补丁数据！",
          type: "error",
        });
        return;
      }
      this.loadFormVisible = true;
      this.upLoadForm = Object.assign({}, row);
    },
    // 请求-上传附件
    upLoadFile() {
      const _this = this;
      const fileType = ["exe", "txt"];
      const inputFile = document.createElement("input");
      inputFile.type = "file";
      inputFile.style.display = "none";
      document.body.appendChild(inputFile);
      inputFile.click();
      inputFile.addEventListener("change", function () {
        const file = inputFile.files[0];
        var testmsg = file.name.substring(file.name.lastIndexOf(".") + 1);
        if (!fileType.includes(testmsg)) {
          _this.$message.warning("上传的文件格式只能是exe格式");
          document.body.removeChild(inputFile);
          return false;
        }
        const formData = new FormData();
        formData.append("P_Version", "9.19.0");
        formData.append("P_Type", "T");
        formData.append("file", file);

        uploadPatch(formData).then((res) => {
          if (res.data.success) {
            _this.editLoading = false;
            _this.$message({
              message: res.data.msg,
              type: "success",
            });
            _this.loadFormVisible = false;
            _this.getPatchList();
          } else {
            _this.$message({
              message: res.data.msg,
              type: "error",
            });
          }
        });
      });
    },
    showupLoad() {
      this.loadFormVisible = true;

      this.upLoadForm.files = this.fileList[0].raw;

      let para = Object.assign({}, this.upLoadForm);

      uploadPatch(para).then((res) => {
        if (util.isEmt.format(res)) {
          this.editLoading = false;
          return;
        }
        if (res.data.success) {
          this.editLoading = false;
          this.$message({
            message: res.data.msg,
            type: "success",
          });
          this.loadFormVisible = false;
          this.getPatchList();
        } else {
          this.$message({
            message: res.data.msg,
            type: "error",
          });
        }
      });
    },
    downLoadPatch() {
      var version = "9.20.0";
      var type = "GEPS";
      window.open(
        "http://localhost:9291/api/Patch/DownPatchFile?version=" +
          version +
          "&type=" +
          type
      );
    },
    //显示新增界面
    AddPatch() {
      this.addFormVisible = true;
      this.options = [];
      this.addForm = {
        P_Name: "",
        P_Version: "",
        P_Type: "",
      };
    },
    //显示编辑界面
    EditPatch() {
      let row = this.currentRow;
      this.options = [];
      if (!row) {
        this.$message({
          message: "请选择要编辑的一行数据！",
          type: "error",
        });
        return;
      }
      this.editFormVisible = true;
      this.editForm = Object.assign({}, row);
    },
    //删除
    DelPatch() {
      let row = this.currentRow;
      if (!row) {
        this.$message({
          message: "请选择要删除的一行数据！",
          type: "error",
        });
        return;
      }
      this.$confirm("确认删除该记录吗?", "提示", {
        type: "warning",
      })
        .then(() => {
          this.listLoading = true;
          let para = { id: row.ID };
          DelPatch(para).then((res) => {
            if (util.isEmt.format(res)) {
              this.listLoading = false;
              return;
            }
            this.listLoading = false;
            if (res.data.success) {
              this.$message({
                message: "删除成功",
                type: "success",
              });
            } else {
              this.$message({
                message: res.data.msg,
                type: "error",
              });
            }
            this.getPatchList();
          });
        })
        .catch(() => {});
    },
    //编辑
    editSubmit: function () {
      this.$confirm("确认提交吗？", "提示", {}).then(() => {
        this.editLoading = true;
        let para = Object.assign({}, this.editForm);
        editFormPatch(para).then((res) => {
          if (util.isEmt.format(res)) {
            this.editLoading = false;
            return;
          }
          if (res.data.success) {
            this.editLoading = false;
            this.$message({
              message: res.data.msg,
              type: "success",
            });
            this.$refs["editForm"].resetFields();
            this.options = [];
            this.editFormVisible = false;
            this.getPatchList();
          } else {
            this.$message({
              message: res.data.msg,
              type: "error",
            });
          }
        });
      });
    },
    //新增
    addSubmit: function () {
      this.$confirm("确认提交吗？", "提示", {}).then(() => {
        this.addLoading = true;
        let para = Object.assign({}, this.addForm);
        addPatch(para).then((res) => {
          if (util.isEmt.format(res)) {
            this.addLoading = false;
            return;
          }
          if (res.data.success) {
            this.addLoading = false;
            this.$message({
              message: res.data.msg,
              type: "success",
            });
            this.options = [];
            this.addFormVisible = false;
            this.getPatchList();
          } else {
            this.$message({
              message: res.data.msg,
              type: "error",
            });
          }
        });
      });
    },
    callFunction(item) {
      this.filters = {
        name: item.search,
      };
      this[item.Func].apply(this, item);
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getPatchList();
    },
    //获取补丁列表
    getPatchList() {
      let para = {
        patchVersion: "9.20.0",
        patchType: "GEPS",
      };
      this.listLoading = true;

      testapi();
      //NProgress.start();
      getPatchs(para).then((res) => {
        this.total = res.data.response.dataCount;
        this.patchList = res.data.response.data;
        this.listLoading = false;
      });
    },
  },
  mounted() {
    this.getPatchList();
    let routers = window.localStorage.router
      ? JSON.parse(window.localStorage.router)
      : [];
    this.buttonList = getButtonList(this.$route.path, routers);
  },
};
</script>

<style scoped>
.custom-tbl /deep/ .has-gutter .el-checkbox {
  display: none;
}
</style>
